<template>
  <div>
    comB
    <button @click="handleClick">将获取到的默认消息修改后发送给父（隔代）组件</button>
    <br>
    {{ msg }}
  </div>
</template>

<script>
import Emitter from '../mixins/emitter';

export default {
  name: 'componentB',
  mixins: [Emitter],
  data () {
    return {
      msg: '',
      n: 0
    }
  },
  created () {
    this.$on('on-message', this.showMessage)
  },
  methods: {
    showMessage (text) {
      this.msg = text
    },
    handleClick () {
      this.n += 1
      this.msg = 'New Broadcast Message .'
      this.dispatch('componentA', 'on-message', `${this.msg}第${this.n}次修改, `)
    }
  }

}
</script>

<style lang="scss" scoped>
</style>